<br />
<div class="blurred-location-container" style="position:absolute;top:0;left:0;"></div>

<script>
  jQuery(document).ready(function() {
    function createBlurredLocationInput() {
      var locationInput = $('.tag-input .blurred-location-input');
      locationInput.attr("disabled", "disabled");
      let modalUrl = '/locations/modal';
      let firstVar = true;
      <% if (params[:action] == "list") || (params[:action] == "profile") %>
        modalUrl += firstVar ? '?' : '&';
        modalUrl += 'reload=true';
        firstVar = false;
      <% end %>
      if( $(this).attr("submit_to") ) {
        modalUrl += firstVar ? '?' : '&';
        modalUrl += 'url=' + encodeURIComponent($(this).attr("submit_to"));
        firstVar = false;
      }
      $.ajax(modalUrl)
       .done(function(response) {
         $('body').append($('.blurred-location-container').remove()); // move modal to top of DOM for better compatibility
         $('.blurred-location-container').html(response);
         $('#blurred-location-modal').on('shown.bs.modal', function () { blurredLocation.map.invalidateSize(); });
         $('#blurred-location-modal').on('hide.bs.modal', function() {$('.blurred-location-input').removeAttr('disabled');});
         $('#blurred-location-modal').modal();
       });
    }
    $('.blurred-location-input').click(createBlurredLocationInput); // this will setup any button on the page with class .blurred-location-input
  });
</script>
